{extend name="layout:base" /}
{block name="page_style"}
{/block}
{block name="main_content"}
  <div class="page-content">
    <!--主题-->
    <?php if(!empty($current_page)): ?>
      <div class="page-header">
        <h1>
          您当前操作
          <small>
            <i class="ace-icon fa fa-angle-double-right"></i>
            {$current_page.title|default=''}
          </small>
        </h1>
      </div>
    <?php endif; ?>
    <div class="row">
      <div class="col-xs-12">
        <form class="form-horizontal adminform" id="model-form" method="post" action="">
          <div class="tabbable">
            <ul class="nav nav-tabs" id="myTab">
              <li class="active">
                <a data-toggle="tab" href="#base-info">
                  基本信息
                </a>
              </li>
              <li>
                <a data-toggle="tab" href="#seo-info">
                  SEO信息
                </a>
              </li>
            </ul>
            <div class="tab-content">
              <div id="base-info" class="tab-pane fade in active">
                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 
                    专题标题：<span class="red">*</span>
                  </label>
                  <div class="col-sm-10">
                    <input type="text" name="title" placeholder="请输入专题标题" class="col-xs-10 col-sm-5" value="{$topics.title|default=''}" required/>
                  </div>
                </div>
                <div class="space-4"></div>

                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
                   封面图片：
                  </label>
                  <div class="col-sm-10">
                    {:upload_image_id("wap_cover_id", 100, 100, $topics['wap_cover_id'])}
                  </div>
                </div>
                <div class="space-4"></div>

                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
                    介绍：
                  </label>
                  <div class="col-sm-10">
                    <textarea name="description" placeholder="请输入介绍信息" class="col-xs-10 col-sm-5">{$topics.description|default=''}</textarea>
                  </div>
                </div>
                <div class="space-4"></div>
                
                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
                    正文：
                  </label>
                  <div class="col-sm-10">
                    <script id="content" name="content" type="text/plain" style="width:90%;height:400px;">
                      {$topics.content|default=''}
                    </script>
                  </div>
                </div>
                <div class="space-4"></div>

                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 显示状态：  </label>
                  <div class="col-sm-10" style="padding-top:5px;">
                    <input name="status" value="1" class="ace ace-switch ace-switch-4 btn-flat" type="checkbox" <?php if(isset($topics["status"]) && intval($topics["status"])){echo('checked="checked"');} ?> />
                    <span class="lbl"></span>
                  </div>
                </div>
                <div class="space-4"></div>
              </div>
              <div id="seo-info" class="tab-pane fade">
                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
                    SEO标题：
                  </label>
                  <div class="col-sm-10">
                    <textarea name="seo_title" placeholder="请输入专题的SEO标题" class="col-xs-10 col-sm-5">{$topics.seo_title|default=''}</textarea>
                  </div>
                </div>
                <div class="space-4"></div>

                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
                    SEO关键词：
                  </label>
                  <div class="col-sm-10">
                    <textarea name="seo_keywords" placeholder="请输入专题的SEO标题" class="col-xs-10 col-sm-5">{$topics.seo_keywords|default=''}</textarea>
                  </div>
                </div>
                <div class="space-4"></div>

                <div class="form-group">
                  <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
                    SEO描述：
                  </label>
                  <div class="col-sm-10">
                    <textarea name="seo_title" placeholder="请输入专题的SEO描述" class="col-xs-10 col-sm-5">{$topics.seo_description|default=''}</textarea>
                  </div>
                </div>
                <div class="space-4"></div>
              </div>
            </div>
          </div>

          <div class="clearfix form-actions">
            <div class="col-md-offset-3 col-md-9">
              <?php if(isset($topics['id'])): ?>
                <input type="hidden" name="id" value="{$topics.id}">
              <?php endif; ?>
              <button class="btn btn-info" type="submit">
                <i class="ace-icon fa fa-check bigger-110"></i>
                保存
              </button>

              &nbsp; &nbsp; &nbsp;
              <button class="btn" type="reset">
                <i class="ace-icon fa fa-undo bigger-110"></i>
                重置
              </button>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
{/block}
{block name="page_js"}
  <script src="{$site_root}/static/plugins/jquery-validate/jquery.validate.min.js"></script>
  <script src="{$site_root}/static/plugins/ueditor/ueditor.config.js" type="text/javascript"></script>
  <script src="{$site_root}/static/plugins/ueditor/ueditor.all.min.js?v=20170615" type="text/javascript"></script>
  <script src="{$site_root}/static/plugins/ueditor/lang/zh-cn/zh-cn.js" type="text/javascript"></script>
  <script type="text/javascript">
    var ue = UE.getEditor('content', {
      // serverUrl: URL + "{:url('index/upload/umeditor')}",
      retainOnlyLabelPasted: true,  //粘贴只保留标签，去除标签所有属性
      pasteplain: true,
      autoHeightEnabled: false, //是否自动长高，默认true
      scaleEnabled: false, //是否可以拉伸长高，默认true(当开启时，自动长高失效)
      autoFloatEnabled: false, //是否保持toolbar的位置不动，默认true
      initialFrameHeight: 500,  //初始化编辑器高度，默认320
      imageScaleEnabled: false,  //启用图片拉伸缩放
      imagePopup: false, //图片操作的浮层开关，默认打开
      'lineheight':['1', '2', '2.5', '3', '4', '5'],
      toolbars: [[
          'source', '|', 'bold', 'italic', 'underline', 'strikethrough', '|', 'fontsize', 'forecolor', 'backcolor', '|', 'paragraph', 'removeformat','|', 'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', 'lineheight', '|',
          'insertimage', 'horizontal'
        ]]
      });

    jQuery(function($) {
      var tag_input = $('#form-field-tags');
      try{
        tag_input.tag({
          placeholder:tag_input.attr('placeholder'),
          //enable typeahead by specifying the source array
          source: function(query, process) {
            $.ajax({
              url: "{:url('index/tag/typeahead_search')}",
              data: {keyword: encodeURIComponent(query)}
            }).done(function(result_items){
              process(result_items);
            });
          }
        });
      }
      catch(e) {
      //display a textarea for old IE, because it doesn't support this plugin or another one I tried!
        tag_input.after('<textarea id="'+tag_input.attr('id')+'" name="'+tag_input.attr('name')+'" rows="3">'+tag_input.val()+'</textarea>').remove();
      //autosize($('#form-field-tags'));
      }
    });

    $("form#model-form").validate({
      rules:{
        "title":{
          required: true,
          minlength: 2,
          maxlength: 100
        }, "content":{
          required: true
        }
      },
      messages:{
        "title":{
          required: "标题不能为空",
          minlength: "标题不能少于1个字符",
          maxlength: "标题不能超过100个字符"
        }, "content":{
          maxlength: "请输入正文"
        }
      },
      errorClass: "help-inline input-error",
      errorElement: "span",
      highlight:function(element, errorClass, validClass) {
        $(element).parents('.form-group').addClass('has-error');
      },
      unhighlight: function(element, errorClass, validClass) {
        $(element).parents('.form-group').removeClass('has-error');
      // },
      // submitHandler: function(form){
      //   var $form = $(form);
      //   $.ajax({
      //     url: $form.attr("action"),
      //     type: $form.attr("method"),
      //     dataType: "JSON",
      //     data: $form.serialize(),
      //     success: function(data){
      //       if(data.code){
      //         location.href = data["url"];
      //       }else{
      //         alert(data["msg"]);
      //       }
      //     }, error: function () {
      //       alert("数据执行错误！");
      //     }
      //   });
      }
    });
  </script>
{/block}